<script setup>
//引入仓库详情数据
import {useDetailStore} from '/src/store/modules/HospitalDetail.js'
const hospitalStore = useDetailStore();


</script>

<template>
  <div class="notice-container">
    <div class="top">
      <h2>{{ hospitalStore.hospitalDetail.hospital?.hosname }}预约挂号须知</h2>
    </div>
    <div class="info">
        <div class="tips">
          <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;注：为方便您早日就医康复，请您认真阅读预约挂号须知:</p>
        </div>
        <div class="item">
          <h2>一、预约实名制:</h2>
          <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;小医通统一平台电话预约和网上预约挂号均采取实名制注册预约，请您如实提供就诊人员的真实姓名、有效证件号（身份证、护照）、性别、手机号码、社保卡号等基本信息。</p>
        </div>
        <div class="item-1">
          <h2>二、预约挂号:</h2>
          <div class="text">
            <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;按照北京市卫健委统一平台要求，预约挂号规则如下：</p>
            <ul>
              <li> 在同一自然日，同一医院，同一科室，同一就诊单元，同一就诊人，可以预约最多1个号源；</li>
              <li> 在同一自然周，同一就诊人，可以预约最多8个号源；</li>
              <li> 在同一自然月，同一就诊人，可以预约最多12个号源；</li>
              <li> 在同一自然季度，同一就诊人，可以预约最多24个号源。</li>
              <li> 预约号源后，请您准时到指定医院就诊，否则视为放弃号源；</li>
            </ul>
          </div>
        </div>
        <div class="item">
          <h2>三、预约时间:</h2>
          <p>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;预约挂号时间为北京时间，每日上午9:00-12:00，下午1:30-5:30，预约挂号时间段为北京时间，请您准时到指定医院就诊。</p>
          <p>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;预约挂号成功后，请您耐心等待挂号结果，预约号源将在30分钟内到达，请您准时到指定医院就诊。</p>
        </div>
        <div class="item">
          <h2>四、取消预约:</h2>
          <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;已完成预约的号源，如需办理退号，至少在就诊前一工作日15:30前通过网站、微信公众号、114电话等平台预约渠道进行取消预约。
          </p>
        </div>
        <div class="item-1">
          <h2>五、爽约处理:</h2>
          <div class="text">
            <p>
              &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;如预约成功后患者未能按时就诊且不办理取消预约号视为爽约，同一患者在自然年内爽约规则如下：</p>
            <ul>
              <li>累计爽约3次，自3次爽约日起，90天内不允许通过114平台进行预约挂号；</li>
              <li> 累计爽约6次，自6次爽约日起，180天内不允许通过114平台进行预约挂号。</li>
            </ul>
          </div>
        </div>
    </div>
  </div>
</template>

<style scoped lang="scss">
.notice-container {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;

  .top {
    width: 100%;
    height: 60px;
    line-height: 60px;
    text-align: center;
    background-color: #33d9c2;
    border-radius: 5px;

    h2 {
      font-size: 24px;
      font-weight: bold;
    }
  }

  .info {
    display: flex;
    flex-direction: column;
    border: 1px solid #dbd7d7;
    border-radius: 8px;
    margin-top: 20px;

    .tips {
      p {
        font-size: 20px;
        font-weight: bold;
        margin: 10px 20px;
        color: #f89258;
      }
    }

    .item {
      display: flex;
      flex-wrap: wrap;
      padding: 10px 20px;

      p {
        font-family: Arial, sans-serif;
        font-size: 18px;
        padding: 10px 0px;
      }
    }

    .item-1 {
      display: flex;
      flex-wrap: wrap;
      padding: 10px 20px;

      h2 {
        font-size: 24px;
        font-weight: bold;
        margin-bottom: 10px;
      }

      .text {
        font-family: Arial, sans-serif;
        font-size: 18px;

        p {
          padding: 10px 0px;
        }

        ul {
          margin-left: 50px;
          list-style: disc;

          li {
            margin-bottom: 10px;
          }
        }
      }
    }
  }
}

</style>